<div class="flex grow flex-col gap-y-5 overflow-y-auto bg-orange-600 px-6">
  <div class="flex h-16 shrink-0 items-center">
    <a href="<%= @project_permissions ? "#{@project.path}/dashboard" : "/project" %>">
      <img class="h-6 w-auto" src="/logo-white.png" alt="Ubicloud">
    </a>
  </div>
  <nav class="flex flex-1 flex-col">
    <ul role="list" class="flex flex-1 flex-col gap-y-7">
      <li>
        <ul role="list" class="-mx-2 space-y-1">
          <% if @project_permissions %>
            <%== part(
              "layouts/sidebar/item",
              name: "Dashboard",
              url: "#{@project.path}/dashboard",
              is_active: request.path.start_with?("#{@project.path}/dashboard"),
              icon: "hero-home"
            ) %>
            <%== part(
              "layouts/sidebar/item",
              name: "Compute",
              url: "#{@project.path}/vm",
              is_active: request.path.start_with?("#{@project.path}/vm"),
              icon: "hero-server-stack"
            ) %>
            <%== part(
              "layouts/sidebar/item",
              name: "Networking",
              url: "#{@project.path}/private-subnet",
              is_active:
                request.path.start_with?("#{@project.path}/private-subnet") ||
                request.path.start_with?("#{@project.path}/firewall") ||
                request.path.start_with?("#{@project.path}/load-balancer"),
              icon: "hero-globe-alt"
            ) %>
            <%== part(
              "layouts/sidebar/item",
              name: "PostgreSQL",
              url: "#{@project.path}/postgres",
              is_active: request.path.start_with?("#{@project.path}/postgres"),
              icon: "hero-circle-stack"
            ) %>
            <%== part(
              "layouts/sidebar/item",
              name: "AI Inference",
              url: "#{@project.path}/inference-endpoint",
              is_active: request.path.start_with?("#{@project.path}/inference"),
              icon: "tabler-robot"
            ) %>
            <%== part(
              "layouts/sidebar/item",
              name: "Kubernetes",
              url: "#{@project.path}/kubernetes-cluster",
              is_active: request.path.start_with?("#{@project.path}/kubernetes-cluster"),
              icon: "kubernetes"
            ) %>
            <%== part(
              "layouts/sidebar/item",
              name: "Web Shell",
              url: "#{@project.path}/cli",
              is_active: request.path.start_with?("#{@project.path}/cli"),
              icon: "shell"
            ) %>
          <% else %>
            <%== part(
              "layouts/sidebar/item",
              name: "My Account",
              url: "/account",
              is_active: request.path.start_with?("/account"),
              icon: "hero-user"
            ) %>
            <%== part(
              "layouts/sidebar/item",
              name: "Projects",
              url: "/project",
              is_active: request.path.start_with?("/project"),
              icon: "hero-folder-open"
            ) %>
          <% end %>
        </ul>
      </li>
      <% if @project_permissions && has_project_permission(["Project:user", "Project:billing", "Project:view", "Project:viewaccess", "Project:token"]) %>
        <li>
          <div class="text-xs font-semibold leading-6 text-orange-200">Project Details</div>
          <ul role="list" class="-mx-2 mt-2 space-y-1">
            <% if has_project_permission("Project:user")
                   users_url = "#{@project.path}/user"
                   users_label = "Users"
                 elsif has_project_permission("Project:viewaccess")
                   users_url = "#{@project.path}/user/access-control"
                   users_label = "Access Control"
                 end

               if users_url %>
                 <%== part(
                    "layouts/sidebar/item",
                    name: users_label,
                    url: users_url,
                    is_active: request.path.start_with?("#{@project.path}/user"),
                    icon: "hero-users",
                  ) %>
               <% end %>
            <%== part(
              "layouts/sidebar/item",
              name: "Tokens",
              url: "#{@project.path}/token",
              is_active: request.path.start_with?("#{@project.path}/token"),
              icon: "hero-key",
              has_permission: has_project_permission("Project:token")
            ) %>
            <% if Config.stripe_secret_key %>
              <%== part(
                "layouts/sidebar/item",
                name: "Billing",
                url: "#{@project.path}/billing",
                is_active: request.path.start_with?("#{@project.path}/billing"),
                icon: "hero-banknotes",
                html_id: "billing-icon",
                has_permission: has_project_permission("Project:billing")
              ) %>
            <% end %>
            <%== part(
              "layouts/sidebar/item",
              name: "Settings",
              url: @project.path,
              is_active: request.path == @project.path,
              icon: "hero-cog-6-tooth",
              has_permission: has_project_permission("Project:view")
            ) %>
            <% if @project.get_ff_private_locations %>
              <%== part(
                "layouts/sidebar/item",
                name: "AWS Regions",
                url: "#{@project.path}/private-location",
                is_active: request.path.start_with?("#{@project.path}/private-location"),
                icon: "hero-map-pin",
                has_permission: true
              ) %>
            <% end %>
          </ul>
        </li>
      <% end %>
      <% if @project_permissions && has_project_permission("Project:github") && Config.github_app_name %>
        <li>
          <div class="text-xs font-semibold leading-6 text-orange-200">Integrations</div>
          <ul role="list" class="-mx-2 mt-2 space-y-1">
            <%== part(
              "layouts/sidebar/item",
              name: "GitHub Runners",
              url: "#{@project.path}/github",
              is_active: request.path.start_with?("#{@project.path}/github"),
              icon: "github",
              has_permission: has_project_permission("Project:github")
            ) %>
          </ul>
        </li>

      <% end %>
      <li class="-mx-6 mt-auto">
        <%== render("layouts/sidebar/project_switcher") %>
      </li>
    </ul>
  </nav>
</div>
